<template>
  <div class="mui-pages" style="background-color: #fff;">
    <header class="mui-bar mui-bar-nav">
      <div class="header-common-title flex-justify-start">
        <a @click="fn.back()" href="javascript:void(0)"><img class="back-btn" src="../../../../static/images/back.png"></a>
        <div class="header-search flex-center">会议详情</div>
        <a class="flex-center" href="consult.html"><img class="back-btn" src="../../../../static/images/zzsh_ready_info.png"></a>
      </div>
    </header>
    <div id="slider" class="mui-slider mui-fullscreen">
      <div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
        <div class="meeting-tab flex-justify-start">
          <a @click="tabIndex=0" :class="{'mui-active':tabIndex==0}" class="mui-control-item" href="javascript:void(0)">会议基本信息</a>
          <a @click="tabIndex=1" :class="{'mui-active':tabIndex==1}" class="mui-control-item" href="javascript:void(0)">签到信息</a>
          <a @click="tabIndex=2" :class="{'mui-active':tabIndex==2}" class="mui-control-item" href="javascript:void(0)">记录内容</a>
          <a @click="tabIndex=3" :class="{'mui-active':tabIndex==3}" class="mui-control-item" href="javascript:void(0)">附件</a>
        </div>
      </div>
      <div class="mui-slider-group">
        <!-- ---------会议基本信息---------start -->
        <div v-if="tabIndex==0" id="meetingInfo" class="mui-slider-item mui-control-content mui-active">
          <div id="scroll1" class="mui-scroll-wrapper">
            <div class="mui-scroll record-member-lists">
              <ul class="mui-table-view">
                <li class="mui-table-view-cell list-item">
                  <b>标题：</b><span class="mui-pull-right">贯彻落实党的十九大会议精神工作</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>类型：</b><span class="mui-pull-right">{{data.insPartyMeetingResponseModel.type}}</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>范围：</b><span class="mui-pull-right">{{data.insPartyMeetingResponseModel.scope}}</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>主题：</b><span class="mui-pull-right">{{data.insPartyMeetingResponseModel.subject}}</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>创建人：</b><span class="mui-pull-right">张某某</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>参与人员：</b><span class="mui-pull-right">attendUserName </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>会议时间：</b><span class="mui-pull-right">meetTime  2019-11-25 16:30</span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>会议地点：</b><span class="mui-pull-right">address 第三会议室</span>
                </li>

                <li class="mui-table-view-cell list-item">
                  <b>主持人：</b><span class="mui-pull-right">compereUserName </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>记录人：</b><span class="mui-pull-right">recordEUserName </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>应到人数：</b><span class="mui-pull-right">shouldJoinCount </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>实到人数：</b><span class="mui-pull-right">realJoinCount </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <b>缺席人数：</b><span class="mui-pull-right">lostJoinCount </span>
                </li>
                <li class="mui-table-view-cell list-item">
                  <a href="people.html">
                    <b>参会人员：</b><span class="mui-pull-right">22<span class="mui-icon mui-icon-arrowright"></span></span>
                  </a>
                </li>
                <li class="mui-table-view-cell list-item">
                  <a href="people.html">
                    <b>缺席人员：</b><span class="mui-pull-right">1<span class="mui-icon mui-icon-arrowright"></span></span>
                  </a>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- ---------会议基本信息---------end -->
        <!-- ---------签到信息-----------start -->
        <div v-if="tabIndex==1" id="signIn" class="mui-slider-item mui-control-content">
          <div class="mui-scroll-wrapper">
            <div class="mui-scroll record-member-lists">
              <a href="sign.html" class="sign-pink">
                <span></span>
                <div class="sign-red flex-center">
                  启动会议签到
                </div>
              </a>
              <!-- <a href="sign.html" class="sign-pink">
                                  <span></span>
                                  <button type="button">提交</button>
                              </a> -->
            </div>
          </div>
        </div>
        <!-- ---------签到信息---------end -->
        <!-- ---------记录内容-----------start -->
        <div v-if="tabIndex==2" id="recordContent" class="mui-slider-item mui-control-content">
          <div class="mui-scroll-wrapper">
            <div class="mui-scroll record-member-lists">
              <h3 class="record-item-title">记录内容：</h3>
              <div class="message-details">
                <p>这里是会议记录内容展示这里是会议记录内容展示这里是会议 这里是会议记录内容展示。</p>
              </div>
              <h3 class="record-item-title">讨论内容：</h3>
              <div class="message-details">
                <p>这里是会议记录内容展示这里是会议记录内容展示这里是会议 这里是会议记录内容展示。</p>
              </div>
            </div>
          </div>
        </div>
        <!-- ---------记录内容---------end -->
        <!-- ---------附件-----------start -->
        <div v-if="tabIndex==3" id="enclosure" class="mui-slider-item mui-control-content">
          <div class="mui-scroll-wrapper">
            <div class="mui-scroll record-member-lists">
              <p class="record-item-title">会议附件：</p>
              <ul class="mui-content-padded flex-justify-start">
                <li class="enclosure-upload">
                  <img class="enclosure-upload-file" src="../../../../static/images/slidepic.jpg" />
                  <p class="mui-ellipsis">十九大会议.jpg</p>
                </li>
                <li class="enclosure-upload">
                  <img class="enclosure-upload-file" src="../../../../static/images/up_document.png" />
                  <p class="mui-ellipsis">党的十九大会党的十九大会</p>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- ---------附件---------end -->
      </div>
    </div>
  </div>
</template>

<script>
  import footerbar from '../common/footerbar.vue'
  import tools from '@/utils/tools'
  import loginService from '@/service/loginService'
  import moment from 'moment'
  export default {
    components: {
      footerbar
    },
    name: '',
    data () {
      return {
        fn: tools,
        data: {},
        tabIndex: 0,
        options: {
          pullUpLoad: true,
          scrollbar: false
        },
        objectsName: '',
        swipeData: [],
        infinite: true,
        pageIndex: 0
      }
    },
    created () {
      this.loadData()
    },
    methods: {
      edit (data) {
        this.$router.push({name: 'affairsDetail'})
      },
      detail (data) {
        this.$store.state.affairsData = data
        this.$router.push({name: 'affairsDetail'})
      },
      onPullingUp () {
        console.log('onPullingUp')
        this.loadData()
      },
      loadData () {
        let pkId = this.$route.params.pkId
        loginService.getPubsherMeetingInfoByPkId(pkId).then((res) => {
          if (res.code !== 200) {
            return tools.tip(res.describe === '未查询到资源' ? '已无更多数据' : res.describe)
          }
          this.data = res.data
        })
      }
    }
  }
</script>
